<!doctype html>
<html class="no-js" lang="en">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="x-ua-compatible" content="ie=edge">
		<title>account</title>
		<meta name="description" content="">
		<meta name="viewport" content="width=device-width, initial-scale=1">

		<link rel="icon" href="img/favicon.png" />
		<!-- Place favicon.ico in the root directory -->

		<!-- all css here -->
		<!-- bootstrap.min.css -->
		<link rel="stylesheet" href="css/bootstrap.min.css">
		<!-- font-awesome.min.css -->
		<link rel="stylesheet" href="css/font-awesome.min.css">
		<!-- owl.carousel.css -->
		<link rel="stylesheet" href="css/owl.carousel.css">
		<!-- owl.carousel.css -->
		<link rel="stylesheet" href="css/meanmenu.min.css">
		<!-- shortcode/shortcodes.css -->
		<link rel="stylesheet" href="css/shortcode/shortcodes.css">
		<!-- nivo-slider.css -->
		<link rel="stylesheet" href="css/nivo-slider.css">
		<!-- style.css -->
		<link rel="stylesheet" href="style.css">
		<!-- responsive.css -->
		<link rel="stylesheet" href="css/responsive.css">
		<script src="js/vendor/modernizr-2.8.3.min.js"></script>
	</head>
	<body>
		<header>
			<!-- header-top-area-start -->
			<div class="header-top-area black-bg ptb-7 hidden-xs">
				<div class="container">
					<div class="row">
						<div class="col-lg-3 col-md-3 col-sm-4">
							<div class="header-top-left">
								<span><a href="#">Call us toll free:</a>(+1)866-550-3669</span>
							</div>
						</div>
						<div class="col-lg-9 col-md-9 col-sm-8">
							<div class="header-top-right">
								<ul>
									<li class="slide-toggle"><a href="login.html"><i class="fa fa-user"></i> LoginOut</a>
								</ul>
								</li>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- header-top-area-end -->
			<!-- header-bottom-area-start -->
			<div class="header-bottom-area bg-color-1 ptb-25">
				<div class="container">
					<div class="row">
						<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
							<div class="logo">
								<a href="index.html"><img src="img/logo.png" alt="" /></a>
							</div>
						</div>
						<div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
							<div class="header-bottom-middle">
								<div class="search-box">
									<form>
										<input type="text" placeholder="Search...">
										<button><i class="fa fa-search"></i></button>
									</form>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			</div>
			</div>
			</div>
			</div>
			</div>
			<!-- header-bottom-area-end -->
		</header> <!-- header -->
		<!-- mainmenu-area-start -->
		<div class="mainmenu-area bg-color-2 hidden-xs hidden-sm">
			<div class="container">
				<div class="row">
					<div class="col-lg-3 col-md-3">
						<div class="mainmenu-left visible-lg checkout-page  visible-md">

						</div>
					</div>
				</div>
				<div class="col-lg-9 col-md-9">
					<div class="mainmenu">
						<nav>
							<ul>
								<li><a href="index.html">Home</a></li>
								<li><a href="shop.html">Shop</a></li>
								<li><a href="cart.html">Cart</a></li>
								<li><a href="order.html">Order</a></li>
								<li><a href="myaccount.html">My Account</a></li>
							</ul>
						</nav>
					</div>
				</div>
			</div>
		</div>
		</div>

		<!-- mainmenu-area-end -->
		<!-- breadcrumb start -->
		<div class="breadcrumb-area">
			<div class="container">
				<ol class="breadcrumb">
					<li><a href="index.html"><i class="fa fa-home"></i> Home</a></li>
					<li class="active">Account</li>
				</ol>
			</div>
		</div>
		<!-- breadcrumb end -->
		<!-- account-main-area start -->
		<!-- Page Inner -->
		<h3 class="title" align="center">我的钱包</h3>

		<div class="page-inner" style="height: -webkit-fill-available;">
			<div id="main-wrapper">

				<!--充值模态框
						模态框ID:rechargeModify
						提现金额ID:rechargeCash
						密码ID:rechargePassword
						确认按钮ID:recharge
					-->
				<div class="modal fade" id="rechargeModify" tabindex="-1" role="dialog" aria-labelledby="modifyModalLabel"
				 aria-hidden="true">
					<div class="modal-dialog">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close btn-cancel" data-dismiss="modal" aria-label="Close">
									<span aria-hidden="true">&times;</span>
								</button>
								<h4 class="modal-title">充值</h4>
							</div>
							<div class="modal-body">
								<form action="" role="form">
									<div class="form-group">
										<input type="text" id="rechargeCash" class="form-control" placeholder="充值金额:" required>
									</div>
									<div class="form-group">
										<input type="password" id="rechargePassword" class="form-control" placeholder="密码:" required>
									</div>
								</form>
							</div>
							<div class="modal-footer">
								<button type="button" class="btn btn-default btn-cancel" data-dismiss="modal">取消</button>
								<button type="submit" id="recharge" class="btn btn-primary">确认</button>
							</div>
						</div>
					</div>
				</div>

				<!--更改密码模态框
						模态框ID:passwordChangeModify
						旧密码ID:oldPassword
						新密码ID:newPassword
						确认密码ID:comfirmPassword
						确认更改按钮ID:changePassword
					-->
				<div class="modal fade" id="passwordChangeModify" tabindex="-1" role="dialog" aria-labelledby="modifyModalLabel"
				 aria-hidden="true">
					<div class="modal-dialog">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close btn-cancel" data-dismiss="modal" aria-label="Close">
									<span aria-hidden="true">&times;</span>
								</button>
								<h4 class="modal-title">更改密码</h4>
							</div>
							<div class="modal-body">
								<form action="" role="form">
									<div class="form-group">
										<input type="password" id="oldPassword" class="form-control" placeholder="输入旧密码:" required>
									</div>
									<div class="form-group">
										<input type="password" id="newPassword" class="form-control" placeholder="输入新密码:" required>
									</div>
									<div class="form-group">
										<input type="password" id="comfirmPassword" class="form-control" placeholder="再次输入新密码:" required>
									</div>
								</form>
							</div>
							<div class="modal-footer">
								<button type="button" class="btn btn-default btn-cancel" data-dismiss="modal">取消</button>
								<button type="submit" id="changePassword" class="btn btn-primary">确认更改</button>
							</div>
						</div>
					</div>
				</div>


				<div class="row">
					<div class="col-md-12">
						<div class="panel panel-white">
							<div class="panel-body">
								<div class="table-responsive">
									<table id="example" class="display table" style="width: 100%; cellspacing: 0;" data-show-jumpto="true">
										<thead>
											<tr>
												<th>账户</th>
												<th>余额</th>
											</tr>
										</thead>
									</table>
								</div>
							</div>
							<div class="panel-footer">
								<div class="btn-group">
									<button class="btn btn-success m-b-sm" data-toggle="modal" data-target="#rechargeModify">
										<i class='fa fa-tasks'></i> 充值
									</button>
								</div>
								<div class="btn-group">
									<button type="button" class="btn btn-warning m-b-sm" data-toggle="modal" data-target="#passwordChangeModify">
										<i class="fa fa-key"></i> 更改密码
									</button>
								</div>
								<!-- Page 流水 -->

								<h3 class="title" align="center">流水详情</h3>
							</div>
							<div id="main-wrapper">
								<div class="row">
									<div class="col-md-12">
										<div class="panel panel-white">
											<div class="panel-body">
												<div class="table-responsive">
													<table id="example" class="display table" style="width: 100%; cellspacing: 0;" data-show-jumpto="true">
														<thead>
															<tr>
																<th>交易流水号</th>
																<th>交易类型</th>
																<th>交易金额</th>
																<th>交易申请时间</th>
																<th>处理状态</th>
															</tr>
														</thead>
													</table>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div><!-- Main Wrapper -->
							<div class="page-footer">
								<div id="social_block">
									<ul>
										<li class="facebook"><a href="#">Facebook</a></li>
										<li class="twitter"><a href="#">twitter</a></li>
										<li class="rss"><a href="#">rss</a></li>
										<li class="youtube"><a href="#">youtube</a></li>
										<li class="google-plus"><a href="#">google plus</a></li>
										<li class="pinterest"><a href="#">pinterest</a></li>
									</ul>
								</div>
							</div>
						</div>
					</div>
				</div>
	</body>
	<!-- main end -->
	<!-- Javascripts -->
	<script src="js/jquery-3.3.1.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<!-- nivo.slider.js -->
	<script src="js/jquery.nivo.slider.pack.js"></script>
	<!-- jquery-ui.min.js -->
	<script src="js/jquery-ui.min.js"></script>
	<!-- jquery.magnific-popup.min.js -->
	<script src="js/jquery.magnific-popup.min.js"></script>
	<!-- jquery.meanmenu.min.js -->
	<script src="js/jquery.meanmenu.js"></script>
	<!-- jquery.scrollup.min.js-->
	<script src="js/jquery.scrollup.min.js"></script>
	<!-- owl.carousel.min.js -->
	<script src="js/owl.carousel.min.js"></script>
	<!-- plugins.js -->
	<script src="js/plugins.js"></script>
	<!-- main.js -->
	<script src="js/main.js"></script>
	</body>
</html>
